// 获取初始数据
$.ajax({
    url: '/noinfo/search_product_get/',
    type: 'GET',
    dataType: 'json',
    success: function(data) {
        var products = data.products;
        var themes = data.themes;
        // 表格赋值
        tableUpdate(products);
        // 搜索框选项
        $.each(themes, function(index, item) {
            $('#themelist').append($('<option>').text(item.theme)); 
        });
    }
});

// 更新表格数据
function tableUpdate(data) {
    // 清空表格数据
    $('#table tbody').empty();
    // 遍历数据，构建新的表格行
    $.each(data, function(index, item) {
        var row = $('<tr>');
        var start = new Date(item.date_start);
        var date_start = '';
        if (start.getFullYear() == '1970') {
            date_start = '';
        } else {
            date_start = start.getFullYear() + '年' + (start.getMonth()+1) + '月' + start.getDate() + '日';
        }
        var episodes = '';
        if(item.words || item.episodes) {
            if(item.type=='小说') {
                episodes = item.words/10000 + '万字';
            } else if(item.type=='动画') {
                episodes = item.episodes + '话';
            } else if(item.type=='电视剧') {
                episodes = item.episodes + '集';
            }
        }
        
        row.append($('<td>').text(item.theme).addClass('td0'));
        var link = $('<a>').attr('href', '/noinfo/update_product/?uid=' + item.id).attr('target', 'update-iframe').addClass('a-name').text(item.name);
        row.append($('<td>').addClass('td1').append(link));
        row.append($('<td>').text(item.type).addClass('td2'));
        row.append($('<td>').text(item.playmode).addClass('td3'));
        row.append($('<td>').text(date_start).addClass('td4'));
        row.append($('<td>').text(episodes).addClass('td5'));
        row.append($('<td>').text(item.producer).addClass('td6'));
        row.append($('<td>').text(item.director).addClass('td7'));
        // 添加其他表格列
        $('#table tbody').append(row);
    });
}

// POST获取数据库数据
function clickPost() {
    // 获取按钮ID
    var nameVal = $("#search-box").val();
    var typeVal = $("button.type-on").text();
    // 发送AJAX请求
    $.ajax({
        url: '/noinfo/search_product_post/',
        type: 'POST',
        dataType: 'json',
        data: { 
            name_val: nameVal,
            type_val: typeVal,
        },
        success: function(data) {
            tableUpdate(data);
        }
        });
}

// 类型点击
$('#all, #anime, #movie, #novel, #teleplay').click(function(event) {
    // 恢复所有按钮原样式
    $('button').removeClass('type-on');
    // 当前点击的按钮添加active类
    $(event.target).addClass('type-on');
    clickPost();
});
// 搜索框点击
$('#search-button').click(function() {
    clickPost();
});



// 表单提交更新数据
window.onload = function() {
    $('#iframe').on('load', function() {
        clickPost();
        var button = $('#iframe').contents().find('#submit').text();
        if(button == '提交') {
            $('.button-add').css({
                'background-color': '#1E90FF',
            });
            $('#button-add').css({
                'color': '#fff',
                'cursor': 'default'
            });
            $("#button-add").hover(function() {
                $(this).css("color", "#fff"); 
            }, function() {
                $(this).css("color", "#fff");
            });
        } else {
            $('.button-add').css({
                'background-color': '#fff',
            });
            $('#button-add').css({
                'color': '#1E90FF',
                'cursor': 'pointer'
            });
            $("#button-add").hover(function() {
                $(this).css("color", "#005cb8");
            }, function() {
                $(this).css("color", "#1E90FF");
            });
        }
    });

    $("#search-box").on("keypress", function(event) {
        if (event.which === 13) { // 13 是回车键的键码
          event.preventDefault();
          clickPost();
        }
    });
};